<template>
  <router-view />
</template>

<script setup lang="ts">
// 组件逻辑
</script>

<style lang="scss">
@use '@/styles/index.scss';
#app {
  .sidebar-container {
    background-color: #304156 !important;
    
    .el-menu {
      background-color: #304156 !important;
      border-right: none;
      
      .el-menu-item, .el-sub-menu__title {
        color: #fff !important;
        
        i {
          color: #fff !important;
        }
        
        &:hover {
          background-color: #001528 !important;
        }
        
        &.is-active {
          background-color: #001528 !important;
          color: #1890ff !important;
          
          i {
            color: #1890ff !important;
          }
        }
      }
      
      .el-sub-menu {
        .el-menu {
          background-color: #001528 !important;
          
          .el-menu-item {
            color: #fff !important;
            
            i {
              color: #fff !important;
            }
            
            &:hover {
              background-color: #001528 !important;
            }
            
            &.is-active {
              background-color: #001528 !important;
              color: #1890ff !important;
              
              i {
                color: #1890ff !important;
              }
            }
          }
        }
      }
    }
  }
}
</style>
